HTML 5. All the new browsers support this except Internet Explorer (esp. IE 8). ExCanvas is a workaround for IE.

Supports vector graphics. (SVG for the web.) Older technology is VML, which works with IE.

Flotr: JavaScript library that uses Canvas (a component of HTML 5). Lots of charting features. Bar Graph. Mouse tracks example. Zoom example. Data points can be added, not just lines. Click event hook: it connects points that you create with your mouse, like a prediction graph. Can call for data from the server (another source). Demos on this page: http://solutoire.com/flotr/docs/

Canvas is part of most browsers, such as Firefox.

For an advisory panel meeting we may want to use Java to demo some ideas.

In RITES, using Flotr, students can control graphs in some ways (e.g., dragging axes) and authors control in other ways (e.g., labeling axes). Potentially authors could have check boxes to select which features students could control directly.

Flotr could show any data we want. Other technologies can, too. Some show only slowly; some can show quickly (like a sound graph). Canvas can probably work quickly; SVG probably not. Sources could be other students, or a probe, or a model, or many others.

Raphael JS: SVG is more like Adobe Illustrator (vector graphics). It supports a hierarchy. If you use Raphael it works in IE. Example of graphing programmers' coding time (shown thru GITHUB, a social coding site). Can highlight parts of a pie graph. Mouseover can display coordinates of the line in a line graph.

The library supports more than just graphs – e.g. interact with a map.

Very fluid in moving from one graph to another (e.g., January data to February data).

Raphael keeps records about itself better than Canvas – easier to save data or "listen" for events. But either can be used; just more work in Canvas. Easier to program in Raphael. However the extra structure in Raphael may slow it down if a big data file is involved. Fast or large data structures might be better in Canvas. Raphael seems robust.

Can drag points on a line and the line reshapes itself.

GEONEXT: Dynamic Math software. GEONEXT has Java applets for constructing geometry interactives.

• An example of a GeoNext geometry constructor applet

JSXGraph: Interactive Geometry, plotting, visualization implemented completely in JavaScript using SVG and VML (on IE). Graphics with JavaScript. Works on all browsers. They have a large set of examples.

• JSXGraph Blog
• JSXGraph Google Group
• Examples
• Presentations and White Papers

Different types of graphs: bar, line, pie, line with dots on the line, etc. Dynamic bar chart with a slider. Interactive geometry – quite lovely with colored segments etc. Similar in some ways to Java Sketchpad.

JSXGraph can import data from GEONEXT documents.

Statistics with R (through a server).

Time series double exponential smoothing.

Turtle "programming". Gestural recognition.

GeoSite: GeoSite an the GeometryEditor is designed and developed by Xun Lai, is part of the WME ("Web-based Mathematics Education|http://wme.cs.kent.edu/)] project led by Dr. Paul Wang, at Department of Computer Science, Kent State University. GeometryEditor uses open Web technology SVG (Scalable Vector Graphics) and MathML (Mathematical Markup Language). It does not work on IE yet.

• GeometryEditor and GeoSite wiki
• GeoSite Advanced Page Authoring Help

Protovis. Similar to Raphael. Interesting ways to display data (like Tufte). Chart types. Overlay Tufte-like map onto a Google map. Wide range of data displays. Heat maps.

Carolyn: We have not seen a linkage between a data table and a graph.

MySystem: You can connect a "system" of parts. Uses Canvas now; transitioning to Raphael.

Outline drag-and-drop in a browser (Firefox): This capability is part of HTML 5.

Drag data from a Spreadsheet into a table component in a browser
This is an example for developers and includes a screencast that shows dragging a selected region from OpenCalc (a spreadsheet) into a javascript jQuery table spreadsheet widget.

I can imagine using this capability for:

• portal: creating a whole set of student users at once
• authoring: filling a static table with data from excel

Karma: is an outgrowth of OLPC and Sugar. So other people are working on education applications of HTML 5 and JavaScript.

• Blog article: HTML5 and JS The Future of Open Education
• Karma project wiki

Papercube: is a JavaScript application for visualization of the web of interconnections between research papers. Sidebar appears if you move your mouse to the left hand side. Bibliographic citation database example.

Google motion chart: Has a Play button.

This Google technology uses software developed at gapminder (which Google bought). Here's a great gapminder demo using a world countries dataset – this is similar to some of the functionalities that TERC developed about 15 years ago with their TableTop software. TableTop also included interactive Venn diagrams.